<template>
	<div id="teacherLessonRank" class="teacherLessonRank">
		<button-tab class="customerDetailsTab" v-model="index">
			<button-tab-item :selected="demo === item" v-for="(item, index) in detailList" @click="demo = item" :key="index">{{ item }}</button-tab-item>
		</button-tab>

		<div v-if="this.$store.state.user.userModel.sysTenant.id == 1">
			<div v-if="index === 0" >
				<TeacherLessonRankByTimeYLYN type="0"></TeacherLessonRankByTimeYLYN>
			</div>
			<div v-else-if="index === 1">
				<TeacherLessonRankByTimeYLYN type="1"></TeacherLessonRankByTimeYLYN>
			</div>
			<div v-else-if="index === 2">
				<TeacherLessonRankByTimeYLYN type="2"></TeacherLessonRankByTimeYLYN>
			</div>
		</div>
		<div v-else>
			<div v-if="index === 0" >
				<TeacherLessonRankByTime type="0"></TeacherLessonRankByTime>
			</div>
			<div v-else-if="index === 1">
				<TeacherLessonRankByTime type="1"></TeacherLessonRankByTime>
			</div>
			<div v-else-if="index === 2">
				<TeacherLessonRankByTime type="2"></TeacherLessonRankByTime>
			</div>
		</div>

	</div>
</template>

<script>
	const list = () => ['日课消', '周课消', '月课消']
	import bus from '@/event/eventBus'
	import TeacherLessonRankByTime from './teacherLessonRankByTime'
	import TeacherLessonRankByTimeYLYN from './teacherLessonRankByTimeYLYN'
	import {ButtonTab, ButtonTabItem} from 'vux'
	export default {
		name: "teacher-lesson-rank",
		components: {
			ButtonTab,
			ButtonTabItem,
			TeacherLessonRankByTime,
			TeacherLessonRankByTimeYLYN
		},
		data() {
			return {
				itemList: [],
				detailList: list(),
				demo: '详细信息',
				index: 0
			}
		},
		created: function () {
			bus.$emit("userDefinedEvent", 2)
			bus.$emit("barController", 1)
			bus.$emit("setTopSimpleTitle", '课消排名')
		}
	}
</script>

<style scoped>
	.teacherLessonRank{
		margin-top: 56px;
		margin-bottom: 100px;
	}

	.teacherRankTable {
		background: #fffde2;
		color: black;
	}
</style>